﻿@{
    ViewData["Title"] = "Home Page";
}

    <link href="~/font-awesome-4.7.0/css/font-awesome.css" rel="stylesheet" />
<body class="layui-layout-body">


    <div class="layui-layout layui-layout-admin">


        <div class="layui-header">

            <a href="">
                <div class="layui-logo">sukcore 后台系统</div>
            </a>
            <!-- 头部区域 -->
            <ul class="layui-nav layui-layout-left">


                <li class="layui-nav-item" lay-unselect>

                    <a href="#" class="kit-side-fold" title="菜单缩放">
                        <i class="layui-icon layui-icon-shrink-right"></i>
                    </a>
                </li>

                <li class="layui-nav-item layui-hide-xs" lay-unselect>
                    <a href="http://www.layui.com/admin/" target="_blank" title="前台">
                        <i class="layui-icon layui-icon-website"></i>
                    </a>
                </li>
                <li class="layui-nav-item" lay-unselect>
                    <a href="javascript:;" layadmin-event="refresh" title="刷新">
                        <i class="layui-icon layui-icon-refresh-3"></i>
                    </a>
                </li>

                <li class="layui-nav-item layui-hide-xs" lay-unselect>
                    <input type="text" placeholder="搜索..." autocomplete="off" class="layui-input layui-input-search" layadmin-event="serach" lay-action="template/search.html?keywords=">
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;" class="layTabPlus" tab_url="Home/Contact">用户</a>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;">其它系统</a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="">邮件管理</a>
                        </dd>
                        <dd>
                            <a href="">消息管理</a>
                        </dd>
                        <dd>
                            <a href="">授权管理</a>
                        </dd>
                    </dl>
                </li>

            </ul>
            <ul class="layui-nav layui-layout-right" lay-filter="layadmin-layout-right">

                <li class="layui-nav-item" lay-unselect>
                    <a lay-href="app/message/index.html" layadmin-event="message" lay-text="消息中心">
                        <i class="layui-icon layui-icon-notice"></i>

                        <!-- 如果有新消息，则显示小圆点 -->
                        <span class="layui-badge-dot"></span>
                    </a>
                </li>
                <li class="layui-nav-item layui-hide-xs" lay-unselect>
                    <a href="javascript:;" layadmin-event="theme">
                        <i class="layui-icon layui-icon-theme"></i>
                    </a>
                </li>
                <li class="layui-nav-item layui-hide-xs" lay-unselect>
                    <a href="javascript:;" layadmin-event="note">
                        <i class="layui-icon layui-icon-note"></i>
                    </a>
                </li>
                <li class="layui-nav-item layui-hide-xs" lay-unselect>
                    <a href="javascript:;" layadmin-event="fullscreen">
                        <i class="layui-icon layui-icon-screen-full"></i>
                    </a>
                </li>
                <li class="layui-nav-item" lay-unselect>
                    <a href="javascript:;">
                        <cite>贤心</cite>
                    </a>
                    <dl class="layui-nav-child">

                        <dd>
                            <a href="javascript:;" class="layTabPlus" tab_url="/Home/userinfo">
                                <i class="layui-icon layui-icon-list"></i> <span>基本信息</span>
                            </a>
                        </dd>
                        <dd>
                            <a href="javascript:;" class="layTabPlus" tab_url="/Home/userpassword">
                                <i class="layui-icon layui-icon-list"></i> <span>修改密码</span>
                            </a>
                        </dd>

                        <hr>
                        <dd layadmin-event="logout" style="text-align: center;"><a>退出</a></dd>
                    </dl>
                </li>

                <li class="layui-nav-item layui-hide-xs" lay-unselect>
                    <a href="javascript:;" layadmin-event="about"><i class="layui-icon layui-icon-more-vertical"></i></a>
                </li>
                <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-unselect>
                    <a href="javascript:;" layadmin-event="more"><i class="layui-icon layui-icon-more-vertical"></i></a>
                </li>
            </ul>
        </div>

         

        <div class="layui-side layui-bg-black">


            <div class="layui-side-scroll">
                <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
                <ul class="layui-nav layui-nav-tree" lay-filter="test" id="test">
                    <li class="layui-nav-item">
                        <a class="" href="javascript:;"><i class="fa fa-user-circle-o fa-lg"></i> <span>基本元素</span></a>
                        <dl class="layui-nav-child">

                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/About">
                                    <i class="layui-icon layui-icon-list"></i> <span>单个测试</span>
                                </a>
                            </dd>

                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/FormButton">
                                    <i class="layui-icon layui-icon-list"></i> <span>按钮</span>
                                </a>
                            </dd>
                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/Form">
                                    <i class="layui-icon layui-icon-list"></i> <span>表单</span>
                                </a>
                            </dd>
                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/FormNav">
                                    <i class="layui-icon layui-icon-list"></i> <span>导航/面包屑</span>
                                </a>
                            </dd>

                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/Panel">
                                    <i class="layui-icon layui-icon-list"></i> <span>面板</span>
                                </a>
                            </dd>

                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/timeline">
                                    <i class="layui-icon layui-icon-list"></i> <span>时间线</span>
                                </a>
                            </dd>

                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/layer">
                                    <i class="layui-icon layui-icon-list"></i> <span>弹出层</span>
                                </a>
                            </dd>
                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/upload">
                                    <i class="layui-icon layui-icon-list"></i> <span>文件上传框</span>
                                </a>
                            </dd>
                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/transfer">
                                    <i class="layui-icon layui-icon-list"></i> <span>穿梭框</span>
                                </a>
                            </dd>
                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/tree">
                                    <i class="layui-icon layui-icon-list"></i> <span>树形组件</span>
                                </a>
                            </dd>

                        </dl>
                    </li>
                    <li class="layui-nav-item  ">
                        <a href="javascript:;"><i class="fa fa-vcard fa-lg"></i> <span>数据表格</span></a>
                        <dl class="layui-nav-child">
                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/tablestatic">
                                    <i class="layui-icon layui-icon-list"></i> <span>静态表格</span>
                                </a>
                            </dd>


                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/tableform">
                                    <i class="layui-icon layui-icon-list"></i> <span>form元素复杂表格</span>
                                </a>
                            </dd>


                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/tablecellEdit">
                                    <i class="layui-icon layui-icon-list"></i> <span>左树右表</span>
                                </a>
                            </dd>
                            <dd>
                                <a href="javascript:;" class="layTabPlus" tab_url="/Home/tablethead">
                                    <i class="layui-icon layui-icon-list"></i> <span>复杂表头表格</span>
                                </a>
                            </dd>

                        </dl>
                    </li>
                 
                   
                </ul>
            </div>

        </div>

        <div class="layui-body">
            <!-- 内容主体区域 -->
            <div class="layui-tab" lay-filter="demoTab" lay-allowClose="true">
                <ul class="layui-tab-title">
                    <li class="layui-this noclose" lay-id='base_info'>基本信息</li>
                </ul>
                <div class="layui-tab-content" style="padding:0px;">
                    <div class="layui-tab-item layui-show">
                        <div class="sysNotice col">
                            <blockquote class="layui-elem-quote title">基本信息</blockquote>
                            <table class="layui-table">
                                <tbody>
                                    <tr>
                                        <td>当前版本</td>
                                        <td class="version">V1.2</td>
                                    </tr>
                                    <tr>
                                        <td>开发作者</td>
                                        <td class="author">Leytton</td>
                                    </tr>
                                    <tr>
                                        <td>项目首页</td>
                                        <td class="homePage"><a href="https://gitee.com/Leytton/layTabPlus">https://gitee.com/Leytton/layTabPlus</a></td>
                                    </tr>
                                    <tr>
                                        <td colspan="2">
                                            <script src='https://gitee.com/Leytton/layTabPlus/widget_preview'></script>
                                            <style>
                                                .pro_name a {
                                                    color: #4183c4;
                                                }

                                                .osc_git_title {
                                                    background-color: #fff;
                                                }

                                                .osc_git_box {
                                                    background-color: #fff;
                                                }

                                                .osc_git_box {
                                                    border-color: #E3E9ED;
                                                }

                                                .osc_git_info {
                                                    color: #666;
                                                }

                                                .osc_git_main a {
                                                    color: #9B9B9B;
                                                }
                                            </style>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @*<div class="layui-footer">
            © 2018 <a href="https://gitee.com/Leytton/layTabPlus">layTabPlus</a> - by Leytton
        </div>*@
    </div>
</body>

<script src="~/layui/layui.all.js"></script>
<script src="~/layui/layTabPlus.js"></script>
<script>
// layui-nav-itemed

    var menujson=[{
                menuId:1,
                title:"用户权限",
                partnerId:0,
                tab_url:"",   
                leave:1,             
                icon:"layui-icon layui-icon-set-fill",
            },{
                menuId:2,
                title:"用户管理",
                partnerId:1,
                tab_url:"/Admin/User/Index",
                leave:2,      
                icon:"layui-icon layui-icon-set-fill",
            },{
                menuId:3,
                title:"菜单管理",
                partnerId:1,
                tab_url:"/Admin/User/Index",
                leave:2,      
                icon:"layui-icon layui-icon-set-fill",
            },{
                menuId:4,
                title:"系统管理",
                partnerId:0,
                tab_url:"",   
                leave:1,             
                icon:"layui-icon layui-icon-set-fill",
            },{
                menuId:5,
                title:"基本信息",
                partnerId:4,
                tab_url:"/Home/userinfo",
                leave:2,      
                icon:"layui-icon layui-icon-set-fill",
            },{
                menuId:6,
                title:"修改密码",
                partnerId:4,
                tab_url:"/Home/userpassword",
                leave:2,      
                icon:"layui-icon layui-icon-set-fill",
            }];
            
menujson="";
layui.use([],function (){
    debugger;
    var $ = layui.jquery;
    var element = layui.element;
    var layer = layui.layer;
    var util = layui.util;  

    $.post("/Admin/Menu/FindMenu", { },
        function (data) {
            debugger;
            menujson=data;
            loadmenu();
            element.render();
    });  
    layTabPlus.init({
        $:$,
        element:element,
        lay_filter: 'demoTab'
    });





    function loadmenu(){
        var li="";
        for(var i=0;i<menujson.length;i++){
            if(menujson[i].leave==1){
                li+= "  <li class=\"layui-nav-item\"> "
                li+=" <a href=\"javascript:;\"  >";
                li+="<i class=\""+menujson[i].icon+"\"  style=\"font-size: 17px; \" ></i> ";
                li+=" <span style=\"font-size: 16px; \" >"+menujson[i].title+"</span></span></a> ";
                li+=loadmenudl(menujson[i].menuId);
                li+=" </li>";
            }
        }
        $("#test").append(li);
        $('#test').show()
    }
    function loadmenudl(menuId){
        var dl="<dl class=\"layui-nav-child\"> ";
        for(var i=0;i<menujson.length;i++){
            if(menujson[i].partnerId==menuId){
                dl+="<dd>";
                dl+=" <a href=\"javascript:;\" class=\"layTabPlus\" tab_url=\""+menujson[i].tab_url+"\" >";
                dl+="<i class=\""+menujson[i].icon+"\"  style=\"font-size: 16px; \" ></i> ";
                dl+=" <span style=\"font-size: 14px; \" >"+menujson[i].title+"</span></a> ";
                dl+="</dd>";
            }
        }
        dl+="</dl>";
        return dl;
    }


    
    var isShow = true;  //定义一个标志位
    $('.kit-side-fold').click(function () {
        //选择出所有的span，并判断是不是hidden
        $('.layui-nav-item span').each(function () {
            if ($(this).is(':hidden')) {
                $(this).show();
            } else {
                $(this).hide();
            }
        });
        debugger;
        //判断isshow的状态
        if (isShow) {
            $('.layui-icon.layui-icon-shrink-right').attr('class', 'layui-icon layui-icon-spread-left');
            $('.layui-side.layui-bg-black').width(60); //设置宽度
            $('.kit-side-fold i').css('margin-right', '70%');  //修改图标的位置
            //将footer和body的宽度修改
            $('.layui-body').css('left', 60 + 'px');
            $('.layui-footer').css('left', 60 + 'px');
            //将二级导航栏隐藏
            $('dd span').each(function () {
                $(this).hide();
            });
            //修改标志位
            isShow = false;
        } else {
            $('.layui-icon.layui-icon-spread-left').attr('class', 'layui-icon layui-icon-shrink-right');
            $('.layui-side.layui-bg-black').width(200);
            $('.kit-side-fold i').css('margin-right', '10%');
            $('.layui-body').css('left', 200 + 'px');
            $('.layui-footer').css('left', 200 + 'px');
            $('dd span').each(function () {
                $(this).show();
            });
            isShow = true;
        }


    });


});
</script>




